import React from "react";
import qa from "../../assets/homeImgV2/qa.png";
import atlas from "../../assets/homeImgV2/atlas.png";
import dialog from "../../assets/homeImgV2/dialog.png";
import styles from "./Home.less";
import { Card, Divider, Row, Col } from "antd";
import UserSession from "@/UserSession";
import doc from "../../assets/homeImgV2/doc.png";
import { formatMessage } from 'umi-plugin-react/locale';

import home_01 from "../../assets/homeImgV2/home_01.png";
import home_02 from "../../assets/homeImgV2/home_02.png";
import home_03 from "../../assets/homeImgV2/home_03.png";
import home_04 from "../../assets/homeImgV2/home_04.png";
import home_05 from "../../assets/homeImgV2/home_05.png";
import home_06 from "../../assets/homeImgV2/home_06.png";
import home_07 from "../../assets/homeImgV2/home_07.png";


class QaInfo extends React.Component {
  render() {
    const { loading, info } = this.props
    return (
      <div>
        {
          /**
           * <div className={styles.lineTitle}><img src={staticPath+'/homeImg/qa.png'} /><span>知识概览</span></div>
           * <Divider style={{margin:'16px 0 20px 0'}} />
           */
        }

        <div>
          <Row gutter={[16, 16]}>
            <Col span={24}>
              <div className={styles.qaChild} style={{ background: "rgba(213, 241, 201, 0.32)" }}>
                <div className={styles.firstBox} style={{backgroundImage:"url(../../../knowledgeImage/fileBg.png)",backgroundSize:"100% 100%"}}>
                  <p className={styles.boxTitle}>{formatMessage({ id: 'User.qaInfo.docQa' })}</p>
                  <img src="../../../knowledgeImage/fileIcon.png" className={styles.boxIcon} />
                </div>
                <div className={styles.secondBox}>
                  <Row gutter={[0, 16]} style={{ margin: '0 36px' }}>
                    <Col span={6}>
                      <div>
                        <p className={styles.title}>{formatMessage({ id: 'User.qaInfo.docCount' })}</p>
                        <p className={styles.num}>{info.docCount}</p>
                      </div>
                    </Col>
                    <Col span={6}>
                      <div>
                        <p className={styles.title}>{formatMessage({ id: 'User.qaInfo.docCategoryCount' })}</p>
                        <p className={styles.num}>{info.docCategoryCount}</p>
                      </div>
                    </Col>
                    <Col span={6}>
                      <div>
                        <p className={styles.title}>{formatMessage({ id: 'User.qaInfo.selfBuiltDoc' })}</p>
                        <p className={styles.num}>{info.docDiyCount}</p>
                      </div>
                    </Col>
                    <Col span={6}>
                      <div>
                        <p className={styles.title}>{formatMessage({ id: 'User.qaInfo.uploadDoc' })}</p>
                        <p className={styles.num}>{info.docUploadCount}</p>
                      </div>
                    </Col>
                  </Row>
                </div>
              </div>
            </Col>
          </Row>
          <Row gutter={[16, 16]}>
            <Col span={24}>
              <div className={styles.qaChild} style={{ background: "rgba(216, 232, 255, 0.32)" }}>
                <div className={styles.firstBox} style={{backgroundImage:"url(../../../knowledgeImage/answerBg.png)",backgroundSize:"100% 100%"}}>
                  <p className={styles.boxTitle}>{formatMessage({ id: 'User.qaInfo.qaKnowledge' })}</p>
                  <img src="../../../knowledgeImage/answerIcon.png" className={styles.boxIcon} />
                </div>
                <div className={styles.secondBox}>
                  <Row gutter={[0, 16]} style={{ margin: '0 36px' }}>
                    <Col span={6}>
                      <div>
                        <p className={styles.title}>{formatMessage({ id: 'User.qaInfo.qaCount' })}</p>
                        <p className={styles.num}>{info.qaCount}</p>
                      </div>
                    </Col>
                    <Col span={6}>
                      <div>
                        <p className={styles.title}>{formatMessage({ id: 'User.qaInfo.qaCategoryCount' })}</p>
                        <p className={styles.num}>{info.qaCategoryCount}</p>
                      </div>
                    </Col>
                    <Col span={6}>
                      <div>
                        <p className={styles.title}>{formatMessage({ id: 'User.qaInfo.qaSimilarCount' })}</p>
                        <p className={styles.num}>{info.qaSimilarCount}</p>
                      </div>
                    </Col>
                    <Col span={6}>
                      <div>
                        <p className={styles.title}>{formatMessage({ id: 'User.qaInfo.qaRelCount' })}</p>
                        <p className={styles.num}>{info.qaRelCount}</p>
                      </div>
                    </Col>
                  </Row>
                </div>
              </div>
            </Col>
          </Row>
        </div>
      </div>
    )
  }
}

export default QaInfo
